{extend name="base"/}
{block name="main"}
<link href="/public/static/umedito/themes/default/_css/umeditor.css" type="text/css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/public/css/defau.css">
<script type="text/javascript" src="/public/static/umedito/third-party/jquery.min.js"></script>
<script type="text/javascript" src="/public/static/umedito/third-party/template.min.js"></script>
<script type="text/javascript" charset="utf-8" src="/public/static/umedito/umeditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="/public/static/umedito/_examples/editor_api.js"></script>
<script type="text/javascript" src="/public/static/umedito/lang/zh-cn/zh-cn.js"></script>
<article class="cl pd-20">
    <div id="tab_demo" class="HuiTab" style="margin-bottom: 15px; position:relative;">
        <div class="tabBar clearfix">
            <span onclick="location.href='__CONF_SITE__admin/reserve/thing'">项目列表</span>
            <span onclick="location.href='__CONF_SITE__admin/reserve/thing_add'">添加项目</span>
            <span class="current">编辑项目</span>
        </div>
    </div>
    <form action="" method="post" class="form form-horizontal" id="">
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>项目名称：</label>
            <div class="formControls col-xs-8 col-sm-8">
                <input type="text" autocomplete="off" value="{$list.name}" placeholder="项目名称" class="input-text" name="name">
            </div>
        </div>
        <div class="row cl" style="display: none;">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>是否开启提前支付：</label>
            <div class="formControls col-xs-8 col-sm-8">
                <label onclick="show_money('1');"><input type="radio" value="1" name="is_pay" {if $list.is_pay==1}checked{/if}>开启</label>
                <label onclick="show_money('0');" style="margin-left: 15px;"><input type="radio" name="is_pay" value="0" {if $list.is_pay==0}checked{/if}>关闭</label>
            </div>
        </div>
        <div id="smoney" class="row cl" style="display: none;">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>支付金额：</label>
            <div class="formControls col-xs-8 col-sm-8">
                <input type="text" autocomplete="off" value="{$list.money}" placeholder="支付金额" class="input-text" name="money">
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>关联表单：</label>
            <div class="formControls col-xs-8 col-sm-8">
                <select name="form_id" style="min-width:80px;height:30px;">
                    <option value="0">请选择</option>
                    {volist name="ass_form" id="vo"}
                    <option {if $list.form_id == $vo.id}selected{/if} value="{$vo.id}">{$vo.title}</option>
                    {/volist}
                </select>
            </div>
        </div>
        <div class="row cl">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>图片：</label>
            <div class="formControls col-xs-8 col-sm-8">
                <p style="height: 165px;width:165px;border: dashed 1px #e5e5e5">
                    <img src="{$list.img}" alt="" id="imgarticle_pic" class="thumbnail">
                </p>
                <div style="position: absolute;top:50px;left:200px;color: #ccc;">
                    <div class="upload-btn">
                        <span>
                            <input type="hidden" value="{$list.img}" name="img" id="article_pic"/>
                        </span>
                        <input onclick="select_img('1','zhu');" class="btn btn-default" type="button" value="选择图片">
                    </div>
                    <br>
                    选择你要上传的图片
                    <!--
                    图片尺寸根据文章列表样式而定<br>
                    图文横排-建议图片尺寸：200*200px<br>
                    图文竖排-建议图片尺寸：600*300px
                    -->
                </div>
            </div>
        </div>
        <div class="row cl" style="margin-bottom: 100px;">
            <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>预约内容介绍：</label>
            <div class="formControls col-xs-8 col-sm-8">
                <textarea id="editor" name="content" type="text/plain" style="width: 100%; height: 500px;">{$list.content}</textarea>
            </div>
        </div>
        <div class="row cl wq_bottom_btn" style="position: absolute;left: 10px;">
            <div>
                <input class="btn btn-primary radius" onclick="resve_save('{$list.id}')" type="button"
                       value="&nbsp;&nbsp;保存&nbsp;&nbsp;">
            </div>
        </div>
    </form>
</article>
{/block}
{block name="script"}
<script src="/public/menu/js/jquery.artdialog.js"></script>
<script src="/public/menu/js/iframetools.js"></script>
<script type="text/javascript">
    $(function () {
        var ue =UM.getEditor('editor',{
            imageUrl:"__CONF_SITE__app/Umupload/uploadFile", //处理图片上传的接口
            imageFieldName:"upfile", //上传图片的表单的name
            imagePath: ""
        });
    });
    function show_money(oney) {
        if(oney == '1'){
            $('#smoney').show();
        }else{
            $('#smoney').hide();
        }
    }
    function verify(name, money, type, form_id, img, content) {
        if (name == '') {
            layer.msg('预约项目名称不能为空', {icon: 5, time: 1000});
            return false;
        }
        if (money == '') {
            layer.msg('支付金额不能为空', {icon: 5, time: 1000});
            return false;
        }
        /*
        if (type == 0) {
            layer.msg('请选择预约项目的所属分类', {icon: 5, time: 1000});
            return false;
        }
        */
        if (form_id == 0) {
            layer.msg('请选择要关联的表单', {icon: 5, time: 1000});
            return false;
        }
        if (img == '') {
            layer.msg('请上传一张图片', {icon: 5, time: 1000});
            return false;
        }
        if (content == '') {
            layer.msg('预约内容介绍不能为空', {icon: 5, time: 1000});
            return false;
        }
        return true;
    }
    var flag = false;//防止重复提交
    //添加预约项目
    var smoney = 0;
    function resve_save(id) {
        var name = $("[name='name']").val();
        var is_pay = $("[name='is_pay']:checked").val();
        var money = $("[name='money']").val();
        var type = 0;//$("[name='type']").val();
        var form_id = $("[name='form_id']").val();
        var img = $("[name='img']").val();
        var content = $("[name='content']").val();
        if (verify(name, money, type, form_id, img, content) && !flag) {
            flag = true;
            $.ajax({
                type: "post",
                url: "{:url('admin/reserve/thing_edit')}",
                data: {
                    id: id,
                    name: name,
                    is_pay: is_pay,
                    money: money,
                    type: type,
                    form_id: form_id,
                    img: img,
                    content: content,
                },
                success: function (data) {
                    if (data['code'] > 0) {
                        layer.msg('保存成功!', {icon: 1, time: 1000}, function () {
                        location.href = "{:url('reserve/thing')}";
                        });
                    }
                    else {
                        layer.msg('添加失败', {icon: 5, time: 1000});
                        flag = false;
                    }
                }
            });
        }
    }
    function zhu_images(id,path) {
        $("#article_pic").val(path);
        $("#imgarticle_pic").attr('src',path);
    }
    function select_img(number,type) {
        art.dialog.open(('__CONF_SITE__admin/images/dialogalbumlist&number=' + number + '&type=' + type), {
            lock : true,
            title : "我的图片",
            width : 900,
            height : 620,
            drag : false,
            background : "#000000",
            scrollbar:false,
        }, true);
    }
</script>
{/block}